<template>
  <div class="auto" >
    <validator name='v'>
      <form class="form-horizontal">
        <p class="bg-info text-center" style="padding: 8px;">机表收费</p>
        <div class="row" style="margin-top:5px;">
          <pay-style :pay.sync='row.logicmodel.f_payment'></pay-style>
          <div class="col-sm-3 form-input-group">
            <label for="f_pregas" class=" control-label">用气量:</label>
            <input class="form-control" type="number"
            v-model="row.logicmodel.f_pregas" placeholder="用气量"
            v-scale = "[row.logicmodel.f_pregas, 2]" disabled>
          </div>
          <div class="col-sm-3 form-input-group">
            <label for="f_preamount" class="control-label">用气金额:</label>
            <input class="form-control"  type="number" v-model="row.logicmodel.f_preamount"
            v-scale = "[row.logicmodel.f_preamount, 2]"
            placeholder="用气金额" disabled>
          </div>
          <print-style :print.sync='row.logicmodel.f_print'></print-style>
        </div>
        <div class="row" style="margin-top:6px;">
          <div class="col-sm-3 form-input-group">
            <label for="f_balance"  class="control-label">上期结余:</label>
            <input class="form-control"  type="number" v-model="row.logicmodel.f_balance"
            v-scale="[row.logicmodel.f_balance,2]" placeholder="应收金额" disabled>
          </div>

          <div class="col-sm-3 form-input-group">
            <label for="f_overdue" class="control-label">滞纳金:</label>
            <!-- <span class="col-sm-2 form-control-static">{{model.f_totalcost}}</span> -->
            <input class="form-control"  type="number" v-model="newOverdue"
            v-scale="[newOverdue,2]" placeholder="滞纳金" @blur="calOverdue()" readonly>
            <button type="button" name="button" class="btn btn-link" @click="show=true">修改</button>
          </div>

          <div class="col-sm-3 form-input-group">
            <label for="f_lowest" class="control-label">最低缴费:</label>
            <!-- <span class="col-sm-2 form-control-static">{{model.f_totalcost}}</span> -->
            <input class="form-control"  type="number" v-model="row.logicmodel.f_lowest"
             v-scale = "[row.logicmodel.f_lowest, 2]" placeholder="应收金额" disabled>
          </div>

          <div class="col-sm-3 form-input-group">
            <label for="f_curbalance" class="control-label">本期结余:</label>
            <input class="form-control"  type="number" v-model="curbalance"  placeholder="0"
            v-scale = "[curbalance, 2]" disabled>
          </div>


        </div>
        <div class="row" style="margin-top:5px;">
          <div class="col-sm-3 form-input-group">
            <label for="f_totalcost" class=" col-sm-2 control-label">应收金额:</label>
            <input class="form-control"  type="number" v-model="row.logicmodel.f_totalcost"
            v-scale = "[row.logicmodel.f_totalcost, 2]" placeholder="应收金额" disabled>
          </div>

          <div class="col-sm-3 form-input-group">
            <label for="f_collection" class="control-label">收款:</label>
            <input id="f_collection" class="form-control" type="number" v-model="row.logicmodel.f_collection"
            v-validate:f_collection='{dctest: [ row.logicmodel.f_lowest, ">=" ] }'  v-scale = "[row.logicmodel.f_collection, 2]"
            @keyup.enter="confirm()">
          </div>
            <span v-if="$v.f_collection.dctest" style="color:red">收款不能小于最低缴费金额</span>
        </div>
      </form>
      <print-bill :show="print" v-ref:printbill :data='row' v-on:toggle="close"></print-bill>
      <div style="margin-top:10px;" class="row auto">
        <div class="form-group" style="margin-top:50px;margin-left:60%">
          <button class="btn btn-success width-60" @click="confirm()"  :disabled='!$v.valid'>确认</button>
          <button class="btn btn-default width-60" @click="clean()" style="margin-left:20px;">取消</button>
        </div>
      </div>
    </validator>
    <idverify :show.sync="show" @change-con="changeOverdue"></idverify>
  </div>
</template>
<script>
/**
*售气收费
*机表收费组件
*/
export default {
  title: '机表收费',
  data () {
    return {
      newOverdue: 0,
      print: false,
      isConfirm: true,
      show: false,
      // 欠费数
      oweNum: 0
    }
  },
  props: ['row'],
  methods: {

    confirm () {
      if (this.row.logicmodel.f_collection >= this.row.logicmodel.f_lowest) {
        if (!this.isConfirm) {
          return
        }
        this.isConfirm = false
        this.row.logicmodel.f_curbalance = this.curbalance
        this.row.logicmodel.f_payment = this.row.logicmodel.f_payment ? this.row.logicmodel.f_payment[0] : '现金缴费'
        this.row.logicmodel.f_overdue = this.newOverdue
        // 未滞纳金修改添加，将修改的值，原因添加到this.row.logicmodel中
        // 如果有变更原因说明有变更
        if (this.f_cause && this.f_cause.length > 0) {
          this.row.logicmodel.f_paydelaypay = this.f_paydelaypay // 应缴滞纳金
          this.row.logicmodel.f_delaypay = this.f_delaypay // 实缴滞纳金
          this.row.logicmodel.f_cause = this.f_cause // 变更原因
        }
        // 设置自动下账的欠费明细
        this.autoaccount()
        this.$MachineChargeService.marchineCharge(this.row.logicmodel, this.row)
        .then((res) => {
          this.row.id = res.data
          this.row.f_bill_type = '机表收费'
          this.row.f_bill_style = this.row.logicmodel.f_print[0]
          console.log('发票类型。。和，欠费记录。。', this.row.f_bill_style, this.oweNum)
          // 主分支不做发票处理
          this.$showAlert('机表缴费成功', 'success', 2000)
          this.$dispatch('success', '机表收费', this.row, res)
          // 判断有没有欠费 （后台返回）
          // if (this.row.f_bill_style === '增值税发票') {
          //   this.$dispatch('success', '机表收费', this.row, res)
          //   this.$showAlert('机表缴费成功', 'success', 2000)
          // } else if (((this.oweNum - 0) - (this.row.rows.length - 0)) > 0) {
          //   this.$dispatch('success', '机表收费', this.row, res)
          //   this.$showAlert(((this.oweNum - 0) - (this.row.rows.length - 0)) > 0 ? '机表缴费成功。但仍有欠费！！！' : '预存款缴费成功', 'success', 2000)
          // } else {
          //   this.print = true
          //   this.$refs.printbill.financebill.search(res.data)
          // }
          // if (this.row.f_bill_style !== '增值税发票') {
          //   if (this.row.logicmodel.f_print[0] === '专用收据') {
          //     this.print = true
          //     this.$refs.printbill.financebill.search(res.data)
          //   } else {
          //     this.print = true
          //     this.$refs.printbill.bill.search(res.data)
          //   }
          // }else {
          //   this.$dispatch('success', '机表收费', this.row, res)
          // }
        }).catch((error) => {
          if (error.status === 603) {
            this.$error('重复提交')
            return
          }
          this.$dispatch('error', '机表收费', this.row, error)
        }
      )
      }
    },
    autoaccount () {
      let arr = []
      let account
      // 将所有的欠费记录，在收费时判断是交完费，影响到发票打印
      this.oweNum = this.row.rows.length
      // 判断是否有滞纳金,第一笔没有滞纳金，说明所有欠费都没有滞纳金
      if (this.row.rows.length === 0 || (this.row.rows.length > 0 && this.row.rows[0].overdue <= 0)) {
        account = (this.row.logicmodel.f_collection - 0) + (this.row.logicmodel.f_balance - 0)
      } else {
        account = (this.row.logicmodel.f_collection - 0) - (this.row.logicmodel.f_lowest - 0)
      }
      this.row.rows.forEach((item) => {
        if (item.overdue <= 0) {
          if (account >= item.f_oughtfee) {
            // 可自动下账
            arr.push(item)
            account = account - item.f_oughtfee
          } else {
            // 存到账户结余
            return
          }
        } else {
          arr.push(item)
        }
      })
      this.row.rows = arr
    },
    calOverdue () {
      let logic = this.row.logicmodel
      console.log('原来滞纳金..', logic.f_overdue)
      console.log('新滞纳金..', this.newOverdue)
      logic.f_lowest = logic.f_lowest - (logic.f_overdue - this.newOverdue)
      logic.f_totalcost = logic.f_totalcost - (logic.f_overdue - this.newOverdue)
      logic.f_overdue = this.newOverdue
    },
    clean () {
      this.$dispatch('success', '机表收费', this.row)
      this.$info('取消操作')
    },
    close () {
      this.showprint = false
      this.print = false
      this.clean()
    },
    changeOverdue (val, reason) {
      this.$set('f_paydelaypay', this.newOverdue) // 应交滞纳金
      this.newOverdue = val // 实缴滞纳金
      this.$set('f_delaypay', this.newOverdue) // 实缴滞纳金
      this.$set('f_cause', this.reason) // 实缴滞纳金
      this.calOverdue()
    }
  },
  watch: {
    'row.logicmodel.f_overdue' (val) {
      this.newOverdue = val
    }
  },
  ready () {
    this.newOverdue = this.row.logicmodel.f_overdue
    // console.log('焦点。，。。。。', this.$refs['focus'])
  },
  computed: {
    'curbalance' () {
      if ((this.row.logicmodel.f_collection - 0) < this.row.logicmodel.f_lowest) {
        return this.row.logicmodel.f_balance
      }
      let account
      // 判断是否有滞纳金,第一笔没有滞纳金，说明所有欠费都没有滞纳金
      if (this.row.rows.length === 0 || this.row.rows.length > 0 && this.row.rows[0].overdue <= 0) {
        account = (this.row.logicmodel.f_collection - 0) + this.row.logicmodel.f_balance
      } else {
        account = (this.row.logicmodel.f_collection - 0) - this.row.logicmodel.f_lowest
      }
      // }
      this.row.rows.forEach((item) => {
        if (item.overdue <= 0) {
          if (account.toFixed(2) >= item.f_oughtfee) {
            // 可自动下账
            account = account - item.f_oughtfee
          } else {
            // 存到账户结余
            return
          }
        }
      })
      return account < 0 ? 0 : account.toFixed(2)
    }
  }
}
</script>
